import React, {useEffect, useState} from 'react'
import {
    Switch,
    Route,
    useLocation
} from "react-router-dom"

import {ConfigProvider} from 'zarm'

import routes from '@/router'
import NavBar from "./components/NavBar";

const NeedNavPaths = ['/', '/data', '/user'];

function App() {
    const location = useLocation();
    const {pathname} = location;
    const [showNav, setShowNav] = useState(false);

    useEffect(() => {
        setShowNav(NeedNavPaths.includes(pathname));
    }, [pathname]);

    return (<>
        <ConfigProvider primaryColor={'#007fff'}>
            <Switch>
                {
                    routes.map(route => <Route exact key={route.path} path={route.path}>
                        <route.component/>
                    </Route>)
                }
            </Switch>
        </ConfigProvider>
        <NavBar showNav={showNav}/>
    </>);
}

export default App